<!-- Join telegram channel https://telegram.me/devkini for updates -->
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.13/vue.min.js"></script>
</head>
<body>
<div id="app">
    <ul>
        <li v-for="post in posts">
            {{ post.message }}
            <span @click="getShare(post.id)">Shares: {{ share }}</span>
        </li>
    </ul>
    <button v-if="!loggedIn" @click="login()">Login to view your posts</button>
    <button @click="getPost()">Get Posts</button>
    <pre>{{ $data | json }}</pre>
</div>
<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId      : '1767915503436232',
            xfbml      : true,
            version    : 'v2.5'
        });
    
        new Vue({
            el: "#app",
            data: {
                posts: [],
                loggedIn: false,
                share: null
            },
            methods: {
                getPost: function() {
                    var self = this;
                    FB.api('/me/feed', function(response) {
                        self.posts = response.data;
                    });
                },
                login: function() {
                    var self = this;
                    FB.login(function(response){
                        if (response.status === 'connected') {
                            self.loggedIn = true;
                        }
                    }, {scope: 'publish_actions, user_posts'});
                },
                getShare: function(post_id) {
                    var self = this;
                    FB.api('/' + post_id, {fields: 'shares'}, function(response) {
                        if (response && !response.error) {
                            console.log(response.shares);
                            if (response.shares) {
                                self.share = response.shares.count;
                            }
                        }
                    });
                }
            }
        });
    };

  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
</body>
</html>
